Element: getAttributeNames() method
The getAttributeNames() method of the Element interface returns the attribute names of the element as an Array of strings. If the element has no attributes it returns an empty array.
Using getAttributeNames() along with getAttribute(), is a memoryefficient and performant alternative to accessing Element.attributes.
The names returned by getAttributeNames() are qualified attribute names, meaning that attributes with a namespace prefix have their names returned with that namespace prefix (not the actual namespace), followed by a colon, followed by the attribute name (for example, xlink:href), while any attributes which have no namespace prefix have their names returned asis (for example, href).
Syntax
getAttributeNames()
Parameters
None.
Return value
An (Array) of strings.
Examples
The following example shows how:
- For an attribute which has a namespace prefix,
getAttributeNames()returns that namespace prefix along with the attribute name. - For an attribute which has no namespace prefix,
getAttributeNames()returns just the attribute name, asis.
It's important to understand that:
- An attribute can be present in the DOM with a namespace but lacking a namespace prefix.
- For an attribute in the DOM that has a namespace but lacks a namespace prefix,
getAttributeNames()will return just the attribute name, with no indication that the attribute is in a namespace.
The example below includes such a "namespaced but without a namespace prefix" case.
const element = document.createElement("a");
// set "href" attribute with no namespace and no namespace prefix element.setAttribute("href",
"https://example.com");
// set "href" attribute with namespace and also "xlink" namespace prefix element.setAttributeNS(
"http://www.w3.org/1999/xlink",
"xlink:href",
"https://example.com",
);
// set "show" attribute with namespace but no namespace prefix element.setAttributeNS("http://www.w3.org/1999/xlink",
"show",
"new");
// Iterate over element's attributes
for
(const name of element.getAttributeNames())
{
const value = element.getAttribute(name); console.log(name, value);
}
// logs:
// href https://example.com
// xlink:href https://example.com
// show new
Specifications
| Specification |
|---|
| DOM Standardreffordomelementgetattributenames① |
Browser compatibility
Report problems with this compatibility data on GitHub| desktop | mobile | ||||||||||
|---|---|---|---|---|---|---|---|---|---|---|---|
Chrome | Edge | Firefox | Opera | Safari | Chrome Android | Firefox for Android | Opera Android | Safari on iOS | Samsung Internet | WebView Android | |
getAttributeNames | |||||||||||
Legend
Tip: you can click/tap on a cell for more information.
- Full support
- Full support
m:m.parentNode.removeChild(m). There might be a problem, though, because removing a node and then taking itsnextSibling(in theforclause) will not work as intended.